<template>
  <div class="app-container bg-white">
    <!-- 页面内容 -->
    <div class="page-body">
      <div class="full-width" id="mul_select" >
        <el-form :inline="true" ref="form" :model="form" size="small">
          <el-form-item>
            <el-input size="small" placeholder="请输入商品编码" v-model.trim="form.number" maxlength="40" clearable></el-input>
          </el-form-item>
          <!-- <el-form-item>
            <el-input size="small" placeholder="请输入商品SKU编码" v-model.trim="form.skunumber"></el-input>
          </el-form-item> -->
          <el-form-item>
            <el-input size="small" placeholder="请输入商品名称" v-model.trim="form.title" maxlength="30" clearable></el-input>
          </el-form-item>
          <el-form-item>
            <el-cascader size="small" placeholder="请选择商品分类" v-model="form.classIds" collapse-tags clearable :options="storeClassList" :props="defaultProps"></el-cascader>
          </el-form-item>
          <el-form-item>
            <el-select size="small" v-model="form.logoIds" placeholder="请选择商品品牌" filterable multiple :multiple-limit="10" clearable :value-key="'label'">
              <el-option v-for="item in storeLogoList" :key="item.id" :label="item.label" :value="item.id"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select size="small" v-model="form.tagIds" placeholder="请选择商品标签" filterable multiple :multiple-limit="10" clearable :value-key="'label'">
              <el-option v-for="item in storeTagList" :key="item.id" :label="item.label" :value="item.id"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select size="small" v-model="form.supplyIds" placeholder="请选择供应商" filterable multiple :multiple-limit="10" clearable :value-key="'label'">
              <el-option v-for="item in storeSupplyList" :key="item.id" :label="item.label" :value="item.id"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select size="small" v-model="form.shelvesStatus" placeholder="请选择是否上架" filterable clearable :value-key="'label'">
              <el-option v-for="item in storeStatusList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select size="small" v-model="form.source" placeholder="请选择商品来源" filterable clearable :value-key="'label'" v-if="roleBtns.includes('sys:eco:store') || $store.getters.isAdmin">
              <el-option  v-for="item in storeSourceList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
            <el-select size="small" v-model="form.source" placeholder="请选择商品来源" filterable clearable :value-key="'label'" v-else>
              <el-option  v-for="item in storeSourceListOther" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select size="small" v-model="form.status" placeholder="请选择是审核状态" filterable clearable :value-key="'label'">
              <el-option v-for="item in auditStatus" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="总销量">
            <el-col :span="8">
               <el-input-number class="numberInput" :controls="false" v-model.trim="form.minSalesNum" placeholder="请输入" :precision="0" :min="0" @keydown.native="inputNoneNumberUnpass" clearable></el-input-number>
            </el-col>
            <el-col class="margin_left_6 margin_right_6" :span="1">——</el-col>
            <el-col :span="8" class="margin_left_6">
               <el-input-number class="numberInput" :controls="false" v-model.trim="form.maxSalesNum" placeholder="请输入" :precision="0" :min="0" @keydown.native="inputNoneNumberUnpass" clearable></el-input-number>
            </el-col>
          </el-form-item>
          <el-form-item label="月销量">
            <el-col :span="8">
               <el-input-number class="numberInput" :controls="false" v-model.trim="form.minSalesNum30" placeholder="请输入" :precision="0" :min="0" @keydown.native="inputNoneNumberUnpass" clearable></el-input-number>
            </el-col>
            <el-col class="margin_left_6 margin_right_6" :span="1">——</el-col>
            <el-col :span="8" class="margin_left_6">
               <el-input-number class="numberInput" :controls="false" v-model.trim="form.maxSalesNum30" placeholder="请输入" :precision="0" :min="0" @keydown.native="inputNoneNumberUnpass" clearable></el-input-number>
            </el-col>
          </el-form-item>   
          <el-form-item>
            <el-button size="small" type="primary" class="width_104" @click="getGoodList()">查询</el-button>
            <el-button size="small" class="width_104" @click="resetOption()">重置</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div>
        <el-button size="mini" type="success" icon="el-icon-document-add" @click="addStore()" v-if="roleBtns.includes('sys:goods:insert') || $store.getters.isAdmin">新建商品</el-button>
        <el-button size="mini" type="warning" icon="el-icon-sell" @click="batchStoreOption('1')" v-if="roleBtns.includes('sys:goods:sale') || $store.getters.isAdmin">批量上架</el-button>
        <el-button size="mini" type="warning" icon="el-icon-sold-out" @click="batchStoreOption('0')" v-if="roleBtns.includes('sys:goods:unsale') || $store.getters.isAdmin">批量下架</el-button>
        <!-- <el-button size="mini" type="warning" icon="el-icon-sold-out" @click="batchStock()" v-if="roleBtns.includes('sys:goods:unsale') || $store.getters.isAdmin">库存导入</el-button>
        <el-button size="mini" type="primary" icon="el-icon-download" @click="outputStoreOption()" class="fr" v-if="roleBtns.includes('sys:goods:export') || $store.getters.isAdmin">库存导出</el-button> -->
        <el-button size="mini" type="primary" icon="el-icon-download" @click="outputStoreOption()" class="fr" v-if="roleBtns.includes('sys:goods:export') || $store.getters.isAdmin">批量导出</el-button>
        <el-button size="mini" type="danger" icon="el-icon-delete" @click="batchStoreDelete()" v-if="roleBtns.includes('sys:goods:selectdelete') || $store.getters.isAdmin">批量删除</el-button>
      </div>
      <!-- 数据table -->
      <el-table class="margin_top_20" ref="multipleTableContent" :data="pageData" stripe :header-cell-style="tableHeaderStyle" v-loading="loading" @sort-change="sortChange" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="42"></el-table-column>
        <el-table-column prop="surfaceImg" label="商品图片" width="90">
          <template slot-scope="scope">
            <img :src="imgBaseUrl + scope.row.surfaceImg" class="shop_avator" v-if="scope.row.surfaceImg"/>
          </template>
        </el-table-column>
        <el-table-column prop="goodsNo" label="商品编码">
          <template slot-scope="scope">
            <div class="text-ellipsis_2" :title="scope.row.goodsNo">{{scope.row.goodsNo}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="title" label="商品名称">
          <template slot-scope="scope">
            <div class="text-ellipsis_2" :title="scope.row.title">{{scope.row.title}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="brandName" label="品牌">
          <template slot-scope="scope">
            <div class="text-ellipsis_2" :title="scope.row.brandName">{{scope.row.brandName}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="sumQty" label="总库存" width="90" sortable>
          <!-- <template slot-scope="scope">
            <div class="text-ellipsis_2" :title="scope.row.brandName">{{scope.row.sumQty}}<i class="el-icon-warning-outline" style="color:#E6A23C"></i></div>
            
          </template> -->
        </el-table-column>
        <el-table-column prop="salesVolume" label="总销量" width="90" sortable></el-table-column>
        <el-table-column prop="salesNum30" label="月销量" width="90" sortable>
           <template slot-scope="scope">
            <span v-if="scope.row.salesNum30">{{scope.row.salesNum30}}</span>
            <span v-else>0</span>
          </template>
        </el-table-column>
        <el-table-column prop="minPrice" label="销售价" width="90"></el-table-column>
        <!-- <el-table-column prop="tagList" label="商品标签">
          <template slot-scope="scope">
            <span v-for="(tag, index) of scope.row.tagList" :key="scope.row.id + index"><label v-if="index > 0">；</label>{{tag}}</span>
          </template>
        </el-table-column> -->
        <el-table-column prop="userName" label="创建人"></el-table-column>
        <el-table-column prop="status" label="审核状态">
          <template slot-scope="scope">
            <span v-if="scope.row.status == 0">--</span>
            <span v-else>{{auditStatus[scope.row.status].label}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" sortable></el-table-column>
        <el-table-column prop="name" label="上下架" width="80">
          <template slot-scope="scope">
            <!-- <span>{{scope.row.isSelf}}</span> -->
            <el-switch v-model="scope.row.shelvesStatusBoolean" @change="switchChange($event, scope.row)" :disabled="(scope.row.status !=2 || scope.row.isSelf == false)?true:false "></el-switch>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="360">
          <template slot-scope="scope">
            <button class="my-btn my-btn--mini my-btn--primary plain" @click="showStore(scope.row.id)">查看</button>
            <template v-if="scope.row.isSelf">
              <button class="my-btn my-btn--mini my-btn--primary plain" @click="editStore(scope.row.id, 1)" v-if="(scope.row.status == 0 || scope.row.status == 2 || scope.row.status == 3) && scope.row.shelvesStatus == 0 ">编辑</button>
              <button class="my-btn my-btn--mini my-btn--primary plain" @click="editStore(scope.row.id, 2)" v-if="(scope.row.status == 0 || scope.row.status == 2 || scope.row.status == 3) && scope.row.shelvesStatus == 0 ">SKU</button>
              <button class="my-btn my-btn--mini my-btn--primary plain" @click="editStore(scope.row.id, 3)" v-if="(scope.row.status == 0 || scope.row.status == 2 || scope.row.status == 3) && scope.row.shelvesStatus == 0 ">营销</button>
              <button class="my-btn my-btn--mini my-btn--danger plain" @click="deleteStoreOption(scope.row.id)" v-if="(scope.row.status == 2 || scope.row.status == 0) && scope.row.shelvesStatus == 0 ">删除</button>
              <!-- <el-button size="mini" @click="skuStore(scope.row.id)">查看SKU</el-button> -->
            </template>
          </template>
        </el-table-column>
      </el-table>
      <div class="text-center">
        <br/>
        <el-pagination background @size-change="handleSizeChange" @current-change="handlePagingChange" :current-page="pageIndex" :page-sizes="pageSizes"
          :page-size="pageSize" :layout="paginationLayout" :total="pageCount">
        </el-pagination>
      </div>
    </div>
    <el-dialog :visible.sync="dialogVisible">
      <el-form :label-width="'5em'">
        <el-form-item label="上传文件">
         <app-uploader-file title="上传文件" :initFiles="fileList" :accept="'file/*'" :multiple="true" :file-format="fileFormat" @change="handleImagesOption($event)"></app-uploader-file>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
              <el-button @click="dialogFormVisible = false">取 消</el-button>
              <el-button type="primary" @click="determine">确 定</el-button>
      </div>
    </el-dialog>
    <message-dialog :dialogTableVisible.sync="dialogTableVisible" :message="objectData"></message-dialog>
  </div>
</template>

<script>
import Setting from '@/settings';
import MessageDialog from '@/components/MessageDialog/index'
import AppUploaderFile from '@/components/AppUploaderFile/index'
import { mapGetters } from 'vuex';
import { GetStoreListByParams, DeleteStoreItem, DeleteStoreItemBatch, ChangeStoreItemStatus, ChangeStoreItemListStatusBatch, 
  GetStoreBrandAllListByParams, GetStoreTagAllListByParams, GetStoreSupplyListAll, GetStoreClassList, ExportStoreList } from '@/views/store-management/services/index';
export default {
  name: 'StoreList',
  components: {
    AppUploaderFile,
    MessageDialog
  },
  data() {
    return {
      dialogVisible: false,
      dialogTableVisible: false,
      objectData: {
        date: '2016-05-03',
        name: 'John Smith',
        address: 'No.1518,  Jinshajiang Road, Putuo District'
      },
      // 查询条件
      sort: null,
      sortField: null,
      form: {
        title: null,
        number: null,
        skunumber: null,
        classIds: [],
        logoIds: [],
        shelvesStatus: null,
        status: null,
        minSalesNum: undefined,
        maxSalesNum: undefined,
        minSalesNum30: undefined,
        maxSalesNum30: undefined,
        tagIds: [],
        supplyIds: [],
        source: null
      },
      pageIndex: 1,
      pageSize: Setting.defaultTablePaginationSize,
      pageSizes: Setting.tablePaginationSizes,
      tableHeaderStyle: Setting.tableHeaderStyle,
      paginationLayout: Setting.tablePaginationLayout,
      loading: false,
      uploadUrl: `${process.env.VUE_APP_BASE_API}/cloudApi/datacenter/file/uploadFile`,

      pageData: [],
      pageCount: 0,
      // 查询条件下拉数据列表
      storeTagList: [],
      storeLogoList: [],
      storeStatusList: [
        { value: '', label: '全部' },
        { value: '1', label: '上架' },
        { value: '0', label: '下架' }
      ],
      auditStatus: [
        { value: 0, label: '未审核' },
        { value: 1, label: '审核中' },
        { value: 2, label: '审核通过' },
        { value: 3, label: '驳回' }
      ],
      storeSourceList: [
        { value: '0', label: '全部' },
        { value: '1', label: '我创建的' },
        // { value: '2', label: '供应链下发' }
      ],
      storeSourceListOther: [
        // { value: '0', label: '全部' },
        { value: '1', label: '我创建的' },
        { value: '2', label: '供应链下发' }
      ],
      storeSupplyList: [],
      storeClassList: [],
      // table选中数组
      multipleSelection: [],
      imgBaseUrl: `${process.env.VUE_APP_FILE_URL}/`,
      defaultProps: {
        value: 'id',
        label: 'title',
        children: 'goodsCategoryModelList',
        multiple: true
      },
      userId: this.$store.getters.userInfo ? JSON.parse(this.$store.getters.userInfo).id : '1',
      fileFormat: ['docx', 'xlsx', 'doc'],
      fileList: [],
      filesList: []
    }
  },
  created() {
    this.getStoreTagList();
    this.getStoreLogoList();
    this.getStoreSupplyList();
    this.getStoreClassList();
    // 获取商品列表
    this.getGoodList();
  },
  activated() {
    this.getGoodList();
  },
  computed: {
    ...mapGetters(['roleBtns'])
  },
  methods: {
    // pointer() {
    //   this.dialogTableVisible = true
    // },
    // 库存批量导
    batchStock() {
      this.dialogVisible = true
    },
    // 文件上传后的数据返回
    handleImagesOption(value) {
      console.log(value)
      this.filesList = value
    },
    determine() {
      console.log('this.filesList',this.filesList)
      this.dialogVisible = false
    },
    sortChange(value) {
      this.getGoodList(value.prop, value.order == 'descending');
    },
    // 获取数据API
    getGoodList(sortField, sort) {
      const classIds = this.form.classIds.map(item => item[item.length - 1]).join(',');
      this.loading = true;
      const queryData = {
        // 商品名称
        title: this.form.title,
        goodsNo: this.form.number,
        skuNo: this.form.skunumber,
        // 是否上下架
        shelvesStatus: this.form.shelvesStatus,
        status: this.form.status, //商品审核状态
        minSalesNum: this.form.minSalesNum,
        maxSalesNum: this.form.maxSalesNum, //总销量的最大最小值
        minSalesNum30: this.form.minSalesNum30,
        maxSalesNum30: this.form.maxSalesNum30, // 月销量的最大最小值
        //商品标签
        categoryIds: classIds,
        brandIds: this.form.logoIds.join(','),
        tagIds: this.form.tagIds.join(','),
        supplierIds: this.form.supplyIds.join(','),
        mchId: this.$store.getters.userInfo ? JSON.parse(this.$store.getters.userInfo).mchId : '1', // 商户id
        // 分页
        pageNum: this.pageIndex,
        pageSize: this.pageSize,
        sort: null,
        sortField: null,
        source: this.form.source?this.form.source: this.roleBtns.includes('sys:eco:store') ? '0' : '3'
      };
      if (sort == false || sort) {
        queryData.sort = sort;
        this.sort = sort;
      } else {
        this.sort = null;
      }
      if (sortField) {
        queryData.sortField = sortField;
        this.sortField = sortField;
      } else {
        this.sortField = null;
      }
      GetStoreListByParams(queryData)
      .finally(() => this.loading = false)
      .then(data => {
        if (data.code != 200) {
          this.$message.error('加载失败，请重新刷新列表');
          return;
        }
        this.pageData = (data.data.list && data.data.list.length) ? data.data.list.map(li => {
          li['shelvesStatusBoolean'] = !!li.shelvesStatus;
          if (li.creatorId == this.userId || this.$store.getters.isAdmin) {
            li['isSelf'] = true;
          }else {
            li['isSelf'] = false;
          }
          return li;
        }) : [];
        this.pageCount = data.data.total;
        if ((!data.data.list || !data.data.list.length) && this.pageIndex > 1) {
          this.pageIndex = 1;
          this.getGoodList();
        }
      })
    },
    // 查询条件清空
    resetOption() {
      // 清空条件
      this.form.title = null;
      this.form.number = null;
      this.form.skunumber = null;
      this.form.classIds = [];
      this.form.logoIds = [];
      this.form.status = null;
      this.form.tagIds = [];
      this.form.supplyIds = [];
      this.form.source = null;
      this.form.status = null;
      this.form.minSalesNum = undefined;
      this.form.maxSalesNum = undefined;
      this.form.minSalesNum30 = undefined;
      this.form.maxSalesNum30 = undefined;
      this.pageIndex = 1;
      this.getGoodList();
    },
    // 分页操作
    handlePagingChange(event) {
      this.pageIndex = event;
      this.getGoodList();
    },
    handleSizeChange(event) {
      this.pageIndex = 1;
      this.pageSize = event;
      this.getGoodList();
    },
    // 批量导出功能
    outputStoreOption() {
      // if (!this.multipleSelection || !this.multipleSelection.length) {
      //   this.$message.warning('请选择需要导出的商品!');
      //   return;
      // }
      const classIds = this.form.classIds.map(item => item[item.length - 1]).join(',');
      this.loading = true;
      const queryData = {
        // 商品名称
        title: this.form.title,
        goodsNo: this.form.number,
        skuNo: this.form.skunumber,
        // 是否上下架
        shelvesStatus: this.form.shelvesStatus,
        status: this.form.status, //商品审核状态
        minSalesNum: this.form.minSalesNum,
        maxSalesNum: this.form.maxSalesNum, //总销量的最大最小值
        minSalesNum30: this.form.minSalesNum30,
        maxSalesNum30: this.form.maxSalesNum30, // 月销量的最大最小值
        //商品标签
        categoryIds: classIds,
        brandIds: this.form.logoIds.join(','),
        tagIds: this.form.tagIds.join(','),
        supplierIds: this.form.supplyIds.join(','),
        sort: this.sort,
        sortField: this.sortField,
        source: this.form.source?this.form.source: this.roleBtns.includes('sys:eco:store') ? '0' : '3',
        mchId: this.$store.getters.userInfo ? JSON.parse(this.$store.getters.userInfo).mchId : '1', // 商户id
        targetIds: this.multipleSelection.map(item => item.id).join(',')
      };
      this.blobAxiosApi('get', '/cloudApi/goods/excel/exportGoodsSku', queryData, '商品导出文件.xlsx')
      .finally(() => this.loading = false)
    },
    // table全选按钮操作
    handleSelectionChange(selectlist) {
      // 及时更新到数组当中
      this.multipleSelection = selectlist;
    },
    // 上架/下架操作
    switchChange(event, rowData) {
      ChangeStoreItemStatus({
        id: rowData.id,
        status: event ? 1 : 0,
      })
      .then(data => {
        if (data.code == 200) {
          this.$message.success((event ? '上架' : '下架') + '成功!');
          this.getGoodList();
        } else {
          this.$message.error((event ? '上架' : '下架') + '失败!');
          rowData.shelvesStatusBoolean = !rowData.shelvesStatusBoolean;
        }
      })
      .catch(error => {
        rowData.shelvesStatusBoolean = !rowData.shelvesStatusBoolean;
      })
    },
    // 删除商品操作
    deleteStoreOption(rowId) {
      this.$confirm('此操作将永久删除该商品, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            instance.confirmButtonLoading = true;
            DeleteStoreItem({ id: rowId })
            .then(data => {
              instance.confirmButtonLoading = false;
              if (data.code == 200) {
                done();
                this.$message.success('删除成功!');
                this.getGoodList();
              } else {
                this.$message.error('删除失败!');
              }
            })
            .catch(error => {
              instance.confirmButtonLoading = false;
            })
          } else {
            done();
          }
        }
      })
    },

    // 批量操作
    // 批量上架
    batchStoreOption(status) {
      if (!this.multipleSelection || !this.multipleSelection.length) {
        this.$message.warning('请选择需要' + (status == '1' ? '上' : '下') + '架的商品!');
        return;
      }
      const allSelf = this.multipleSelection.every(item => item.isSelf);
      if (!allSelf) {
        this.$message.warning('不可操作非本账户创建的商品的状态!');
        return;
      }
      ChangeStoreItemListStatusBatch({
        targetIds: this.multipleSelection.map(item => item.id).join(','),
        status: status
      })
       .then(data => {
        if (data.code == 200) {
          this.$message.success('批量' + (status == '1' ? '上' : '下') + '架成功!');
          this.getGoodList();
        }
      })
      .catch(error => {
        this.$message.error('批量' + (status == '1' ? '上' : '下') + '架失败!');
      })
    },
    // 批量删除操作
    batchStoreDelete() {
      if (!this.multipleSelection || !this.multipleSelection.length) {
        this.$message.warning('请选择需要删除的商品!');
        return;
      }
      const allSelf = this.multipleSelection.every(item => item.isSelf);
      if (!allSelf) {
        this.$message.warning('不可删除非本账户创建的商品!');
        return;
      }
      this.$confirm('此操作将永久删除选中商品, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            instance.confirmButtonLoading = true;
            instance.confirmButtonText = '加载中...';
            DeleteStoreItemBatch({ targetIds: this.multipleSelection.map(item => item.id).join(',') })
            .then(data => {
              instance.confirmButtonLoading = false;
              if (data.code == 200) {
                done();
                this.$message.success('删除成功!');
                this.getGoodList();
              } else {
                this.$message.error('删除失败!');
              }
            })
            .catch(error => {
              instance.confirmButtonLoading = false;
            })
          } else {
            done();
          }
        }
      })
    },

    // 查询条件支持
    // 获取商品品牌
    async getStoreLogoList() {
      const data = await GetStoreBrandAllListByParams({});
      this.storeLogoList = data.data.map(item => {
        item.value = item.id;
        item.label = item.name;
        return item;
      });
    },
    // 获取商品标签
    async getStoreTagList() {
      const data = await GetStoreTagAllListByParams({});
      this.storeTagList = data.data.map(item => {
        item.value = item.id;
        item.label = item.name;
        return item;
      });
    },
    getStoreSupplyList() {
      GetStoreSupplyListAll({status: 1})
      .then(data => {
        this.storeSupplyList = data.data.map(item => {
          item.value = item.id;
          item.label = item.name;
          return item;
        });
      })
    },
    getStoreClassList() {
      GetStoreClassList()
      .then(data => {
        this.storeClassList = data.data;
      })
    },

    // 跳转支持
    // 商品新增页面跳转
    addStore() {
      this.$router.push({
        name: 'StoreAdd'
      })
    },
    // 商品查看页面跳转
    showStore(rowId) {
      this.$router.push({
        name: 'StoreDetail',
        params: { id: rowId }
      })
    },
    // 商品编辑页面跳转
    editStore(rowId, step) {
      this.$router.push({
        name: 'StoreEdit',
        params: { id: rowId },
        query: { nextStep: step }
      })
    },
    // 商品SKU页面跳转
    skuStore(rowId) {
      this.$router.push({
        name: 'CheckSku',
        params: { id: rowId }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.shop_avator {
  width: 64px;
  height: 64px;
  vertical-align: middle;
}

::v-deep .el-cascader .el-input .el-input__inner:focus, .el-cascader .el-input.is-focus .el-input__inner{
	height: 33px; //这里高度根据需求自己设定
}
::v-deep .el-select {
  height: 30px !important;
}
::v-deep .el-select__tags {
  height: 100%;
  white-space: nowrap;
  overflow-x: hidden;
  overflow-y: auto;
}
::v-deep .el-select__tags::-webkit-scrollbar{
    display: none;
} 
::v-deep .el-cascader__tags {
	display: inline-flex;
	margin-right: 60px;
	flex-wrap: nowrap;
}
::v-deep .el-form .el-input {
  width: 224px !important;
}
::v-deep .numberInput .el-input {
    width: 100px !important;
}
::v-deep .numberInput .el-input__inner {
  width: 100px;
}

::v-deep .el-input-number--small {
  width: 100%;
} 

.width_104 {
  width: 104px;
}
</style>

